/**
 * Author：Sam
 * Date: 21.3.11
 * Description: 处理ios 系统底部黑条
 */
// 判断是否IPhone

// 各机型的高度字典
const heightMap = {
  '5.4': {
    screenHeight:1,
    innerHeight:1
  }, // iPhone 12 mini，iPhone 13 mini
  '5.8': {
    screenHeight: 812,
    innerHeight: [641] // 确定
  }, // iPhone X，iPhone XS，iPhone 11 Pro，
  '6.1': {
    screenHeight: 844,
    innerHeight: [670, 673, 667] // 确定
  }, // iPhone XR，iPhone 12 667， iPhone 12 Pro，iPhone 13， iPhone 13 Pro 673
  '6.5': {
    screenHeight: 896,
    innerHeight: [808, 724] // 确定
  }, // iPhone XS Max，iPhone 11 Pro Max，iPhone 11 724
  '6.7': {
    screenHeight: 926,
    innerHeight: [753]
  }, // iPhone 12 Pro Max，iPhone 13 Pro Max
}

// todo
// 目前测试发现conlin的12是可行的，但佳丽的11，amber的12，summer的13还不行

// 当前确定的机型
let currentModel = {}

const isIPhoneWithLine = () => {
  currentModel = false;

  if (navigator.userAgent.indexOf('iPhone') !== -1) {
    currentModel = Object.values(heightMap).find(e => {
      return e.screenHeight === window.screen.height
    })
  }
  return currentModel;
};

// 判断微信底部导航条是否出现
const isWxBottomNavShow = () => {
  const windowInnerHeight = window.innerHeight;
  return currentModel.innerHeight.includes(windowInnerHeight)
};

// // 缓存元素与样式
const elements = [];

export default {
  bind (el, binding) {
    if (isIPhoneWithLine()) {
      let style = binding.value || {};
      elements.push({el, style}); // 保存要执行样式变更的元素及样式

      if (isWxBottomNavShow()) {
        // 有就去掉
        Object.keys(style).forEach(key => {
          el.style[key] = 0;
        });
      } else {
        // 没有底部导航就增加padding
        Object.keys(style).forEach(key => {
          el.style[key] = style[key];
        });
      }

      let oldHeight = window.innerHeight;   /* 原可视区域 */

      window.addEventListener("resize", function () {
        /* safari浏览器的操作栏隐藏时可视区域会变大 */
        if (window.innerHeight > oldHeight) {
          Object.keys(style).forEach(key => {
            el.style[key] = style[key];
          });
        } else {
          Object.keys(style).forEach(key => {
            el.style[key] = 0;
          });
        }
      }, false);
    }
  }
}
